{% import _self as self %} {# Required to use macros in same template #}
{#
Macros
#}

{# Display the checkboxes for a given set of graders at a grader level #}
{% macro display_graders(graders, prefix, section_numbers, history, g_id) %}
    {% for grader in graders %}
        <tr class="{{ prefix }}">
            <th>{{ grader[1] ~ " " ~ grader[2] ~ "(" ~ grader[0] ~ ")" }}</th>
            <td><input type="checkbox" name="{{ prefix }}_all_{{ grader[0] }}" id="{{ prefix }}_all_{{ grader[0] }}"
                       aria-label="all rotating sections"
                       onclick='updateCheckBoxes("{{ prefix }}", "{{ grader[0] }}", 0)'/></td>
            {% for rs in section_numbers %}
                <td><input type="checkbox" name="grader_{{ prefix }}_{{ rs }}_{{ grader[0] }}"
                        id="grader_{{ prefix }}_{{ rs }}_{{ grader[0] }}"
                        aria-label="rotating section {{ rs }}"
                        onclick='updateCheckBoxes("{{ prefix }}", "{{ grader[0] }}", {{ rs }});'
                        {{ (rs in history[grader[0]][g_id]) ? 'checked' : '' }}/></td>
            {% endfor %}

        </tr>
    {% endfor %}

{% endmacro %}

{#
Variables
#}
{# Get array of section numbers #}
{% set section_numbers = range(1, num_rotating_sections) %}
{% set grading_groups = {'1': 'Instructor', '2': 'Full Access Grader', '3': 'Limited Access Grader'} %}

{#
Form
#}

{% if no_rotating_sections %}
	<div name="grader-warning-popup edit-gradeable" id="grader-warning" hidden>
		<p> WARNING: Rotating Sections are not set up yet.  <br />
			All Access Grading and Grading by Rotating Section rely on rotating sections. <br />
			To set them up, go to the Manage Sections page. <br />
		</p>
	</div>
{% endif %}

<label for="minimum_grading_group">What is the lowest privileged user group that can grade this?</label>
    <a class="fa-question-circle" target=_blank aria-label="Help for grading user groups" href="http://submitty.org/instructor/create_edit_gradeable#grading-user-groups"></a>
<select name="min_grading_group" id="minimum_grading_group" class="int_val" style="width:180px;">
    {% for num, role in grading_groups %}
        <option value="{{ num }}" {{ gradeable.getMinGradingGroup() == num ? 'selected' : '' }}>{{ role }}</option>
    {% endfor %}
</select>
<br />

<fieldset>
    <legend>
        How should graders be assigned to grade this item?
        <a class="fa-question-circle" target=_blank aria-label="Help for grading by registration or rotating section" href="http://submitty.org/instructor/create_edit_gradeable#grading-by-registration-section-or-rotating-section"></a>
    </legend>
	<input type="radio" name="grader_assignment_method" id="grader_assignment_method" value="2" id="all_access"
        {{ (gradeable.getGraderAssignmentMethod() == 2) ? 'checked' : '' }}> <label for="grader_assignment_method">All Access Grading</label>

    <input type="radio" name="grader_assignment_method" value="1" id="registration_section"
        {{ (gradeable.getGraderAssignmentMethod() == 1 or action == "new") ? 'checked' : '' }}> <label for="registration_section">Registration Section</label>

    <input type='radio' name="grader_assignment_method" value="0" id="rotating_section"
        {{ (gradeable.getGraderAssignmentMethod() == 0) ? 'checked' : '' }}> <label for="rotating_section">Rotating Section</label>
</fieldset>
<div id="rotating_data">
    {% if rotating_gradeables|length != 0 and num_rotating_sections > 0 %}
        <br />
        Rotating Section History By Grader:
        <br />
        <div class="table-wrapper">
            <div class="table-scroll">
                <table id="grader-history">
                    <tr>
                        <th></th>
                        {% for row in rotating_gradeables|filter((row) => row != gradeable.getId()) %}
                            <th>{{ row }}</th>
                        {% endfor %}
                    </tr>
                    <tr>
                        {% for user_group,users in graders_from_usertypes %}
                            {% for user in users %}
                                <tr class="g_history g{{ user_group }}">
                                    <th>{{ user[1] ~ " " ~ user[2] ~ "(" ~ user[0] ~ ")" }} </th>
                                    {% for g_id in rotating_gradeables|filter((g_id) => g_id != gradeable.getId()) %}
                                        <td>{{ gradeable_section_history[user[0]][g_id]|join(',') }}</td>
                                    {% endfor %}
                                </tr>
                            {% endfor %}
                        {% endfor %}
                    </tr>
                </table>
            </div>
        </div>
    {% endif %}
    <table id="grader_assignment">
        {# Helpful debuging line.  Uncomment to view graders data #}
        {# <tr>{{ all_graders|json_encode() }}</tr> #}
        {% if num_rotating_sections > 0 %}
            <tr>
                <th />
                <th>All</th>
                {% for rs in section_numbers %}
                    <th>{{ rs }}</th>
                {% endfor %}
            </tr>
            <tr class="g1">
                <th>Instructor Graders</th>
            </tr>
            <!-- Instructors -->
            {{ self.display_graders(graders_from_usertypes[1], 'g1',
                section_numbers, gradeable_section_history, gradeable.getId()) }}
            <tr class="g2">
                <th>Full Access Graders</th>
            </tr>
            <!-- Full Access Graders -->
            {{ self.display_graders(graders_from_usertypes[2], 'g2',
                section_numbers, gradeable_section_history, gradeable.getId()) }}
            <tr class="g3">
                <th>Limited Access Graders</th>
            </tr>
            <!-- Limited Access Graders -->
            {{ self.display_graders(graders_from_usertypes[3], 'g3',
                section_numbers, gradeable_section_history, gradeable.getId()) }}
        {% elseif num_rotating_sections == 0 %}
            <br/>
            <p><b>Rotating Sections have not been set up yet. <br/> You can set up Rotating Sections using the "Manage Sections" option on the sidebar.</b></p>
        {% endif %}
    </table>
</div>

<script type="text/javascript">

    // Updates the checkboxes for all sections for a student
    //  This feature purely a front-end convenience.
    function updateCheckBoxes(prefix, id, section) {
        var base_cb_name = '#grader_' + prefix + '_';
        var base_all_cb_name = '#' + prefix + '_';

        // User pressed the "all" box ...
        if(section === 0) {
            // ... so update all check boxes for that user with the "all" box state
            var check = $(base_all_cb_name + 'all_' + id).is(':checked');
            {% for rs in section_numbers %}
                $(base_cb_name + {{ rs }} + '_' + id).prop('checked', check);
            {% endfor %}
        }
        else {
            // if all boxes are checked, then check the 'all' box
            var all_checked = true
            {% for rs in section_numbers %}
                && $(base_cb_name + {{ rs }} + '_' + id).is(':checked')
            {% endfor %}
            ;

            $(base_all_cb_name + 'all_' + id).prop('checked', all_checked);
        }
    }

    function onSectionTypeChange() {
        if ($('#rotating_section').is(':checked')) {
            disableElementChildren('#rotating_data', false);
            disableElementChildren('#grader-warning',false);
        }
        else if ($('#all_access').is(':checked')) {
            disableElementChildren('#rotating_data', true);
            disableElementChildren('#grader-warning',false);
        }
        else {
            disableElementChildren('#rotating_data', true);
            disableElementChildren('#grader-warning',true);
        }
    }

    function onMinGraderChange() {
        // $('.g1').show();
        // $('.g2').show();

        disableElementChildren('.g2', false);
        disableElementChildren('.g3', false);

        switch ($('#minimum_grading_group').val()) {
            case '1': // Instructor only?
                // $('.g1').hide();
                disableElementChildren('.g2', true);
            case '2': // Instructors and TA's
                // $('.g2').hide();
                disableElementChildren('.g3', true);
            case '3': // Everyone
                break;
            default:
                alert('Error!  Invalid Minimum Grader!');
                break;
        }
    }

    $(document).ready(function() {
        // Hide rotating sections settings if on registration sections
        onSectionTypeChange();
        $('[name="grader_assignment_method"]').change(onSectionTypeChange);

        // Only show the graders who should have grade access to the assignment
        onMinGraderChange();
        $('#minimum_grading_group').change(onMinGraderChange);

        // update "all" check boxes
        {% for grader in graders_from_usertypes[1] %}
        updateCheckBoxes('g1', "{{ grader[0] }}", 1);
        {% endfor %}
        {% for grader in graders_from_usertypes[2] %}
        updateCheckBoxes('g2', "{{ grader[0] }}", 1);
        {% endfor %}
        {% for grader in graders_from_usertypes[3] %}
        updateCheckBoxes('g3', "{{ grader[0] }}", 1);
        {% endfor %}

    });

</script>
